<!DOCTYPE html>
<html lang="pt-br">

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="Content-Language" content="pt-br">
    <meta name="color-scheme" content="light dark">

    
      <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests; block-all-mixed-content; default-src 'self'; child-src 'self'; font-src 'self' https://fonts.gstatic.com https://cdn.jsdelivr.net/; form-action 'self'; frame-src 'self'; img-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline' https://fonts.googleapis.com/ https://cdn.jsdelivr.net/; script-src 'self' 'unsafe-inline' https://www.google-analytics.com; prefetch-src 'self'; connect-src 'self' https://www.google-analytics.com;">

    

    <meta name="author" content="João Ninguém">
    <meta name="description" content="Artigo de exemplo mostrando a sintaxe básica Markdown e a formatação de elementos HTML.">
    <meta name="keywords" content="blog,desenvolvedor,pessoal">

    <meta name="twitter:card" content="summary"/>
<meta name="twitter:title" content="Guia de Sintaxe Markdown"/>
<meta name="twitter:description" content="Artigo de exemplo mostrando a sintaxe básica Markdown e a formatação de elementos HTML."/>

    <meta property="og:title" content="Guia de Sintaxe Markdown" />
<meta property="og:description" content="Artigo de exemplo mostrando a sintaxe básica Markdown e a formatação de elementos HTML." />
<meta property="og:type" content="article" />
<meta property="og:url" content="https://www.asueeer.com/pt-br/posts/markdown-syntax/" /><meta property="article:section" content="posts" />
<meta property="article:published_time" content="2019-03-11T00:00:00+00:00" />
<meta property="article:modified_time" content="2019-03-11T00:00:00+00:00" /><meta property="og:site_name" content="João Ninguém" />




    <title>
  Guia de Sintaxe Markdown · João Ninguém
</title>

    
      <link rel="canonical" href="https://www.asueeer.com/pt-br/posts/markdown-syntax/">
    

    <link rel="preload" href="/fonts/forkawesome-webfont.woff2?v=1.2.0" as="font" type="font/woff2" crossorigin>

    
      
      
      <link rel="stylesheet" href="/css/coder.min.708686f8ab8176e91d44fcbe488a0fe0333b94f405cf18a52383d67ba22f0ccb.css" integrity="sha256-cIaG&#43;KuBdukdRPy&#43;SIoP4DM7lPQFzxilI4PWe6IvDMs=" crossorigin="anonymous" media="screen" />
    

    

    
      
        
        
        <link rel="stylesheet" href="/css/coder-dark.min.aa883b9ce35a8ff4a2a5008619005175e842bb18a8a9f9cc2bbcf44dab2d91fa.css" integrity="sha256-qog7nONaj/SipQCGGQBRdehCuxioqfnMK7z0Tastkfo=" crossorigin="anonymous" media="screen" />
      
    

    

    

    <link rel="icon" type="image/png" href="/images/favicon-32x32.png" sizes="32x32">
    <link rel="icon" type="image/png" href="/images/favicon-16x16.png" sizes="16x16">

    <link rel="apple-touch-icon" href="/images/apple-touch-icon.png">
    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png">

    

    <meta name="generator" content="Hugo 0.88.1" />
  </head>

  
  
    
  
  <body class="preload-transitions colorscheme-auto"
        onload=""
  >
    
<div class="float-container">
    <a id="dark-mode-toggle" class="colorscheme-toggle">
        <i class="fa fa-adjust fa-fw" aria-hidden="true"></i>
    </a>
</div>


    <main class="wrapper">
      <nav class="navigation">
  <section class="container">
    <a class="navigation-title" href="/pt-br">
      João Ninguém
    </a>
    
      <input type="checkbox" id="menu-toggle" />
      <label class="menu-button float-right" for="menu-toggle">
        <i class="fa fa-bars fa-fw" aria-hidden="true"></i>
      </label>
      <ul class="navigation-list">
        
          
            <li class="navigation-item">
              <a class="navigation-link" href="/pt-br/about/">Sobre</a>
            </li>
          
            <li class="navigation-item">
              <a class="navigation-link" href="/pt-br/posts/">Blog</a>
            </li>
          
            <li class="navigation-item">
              <a class="navigation-link" href="/pt-br/projects/">Projetos</a>
            </li>
          
            <li class="navigation-item">
              <a class="navigation-link" href="/pt-br/contact/">Contato</a>
            </li>
          
        
        
          
          
          
            
              
                <li class="navigation-item menu-separator">
                  <span>|</span>
                </li>
                
              
              <li class="navigation-item">
                <a href="https://www.asueeer.com/posts/markdown-syntax/">🇬🇧</a>
              </li>
            
          
        
      </ul>
    
  </section>
</nav>


      <div class="content">
        
  <section class="container post">
    <article>
      <header>
        <div class="post-title">
          <h1 class="title">
            <a class="title-link" href="https://www.asueeer.com/pt-br/posts/markdown-syntax/">
              Guia de Sintaxe Markdown
            </a>
          </h1>
        </div>
        <div class="post-meta">
          <div class="date">
            <span class="posted-on">
              <i class="fa fa-calendar" aria-hidden="true"></i>
              <time datetime='2019-03-11T00:00:00Z'>
                March 11, 2019
              </time>
            </span>
            <span class="reading-time">
              <i class="fa fa-clock-o" aria-hidden="true"></i>
              3 minutos de leitura
            </span>
          </div>
          
          <div class="categories">
  <i class="fa fa-folder" aria-hidden="true"></i>
    <a href="/pt-br/categories/temas/">temas</a>
      <span class="separator">•</span>
    <a href="/pt-br/categories/sintaxe/">sintaxe</a></div>

          <div class="tags">
  <i class="fa fa-tag" aria-hidden="true"></i>
    <span class="tag">
      <a href="/pt-br/tags/markdown/">markdown</a>
    </span>
      <span class="separator">•</span>
    <span class="tag">
      <a href="/pt-br/tags/css/">css</a>
    </span>
      <span class="separator">•</span>
    <span class="tag">
      <a href="/pt-br/tags/html/">html</a>
    </span></div>

        </div>
      </header>

      <div>
        
        <p>Esse artigo é um exemplo básico para mostrar a sintaxe Markdown que é usada nos arquivos de conteúdo do Hugo. Ele também mostrar como cada elemento básico HTML é estilizado com CSS com os temas do Hugo.</p>
<h2 id="cabeçalhos">
  Cabeçalhos
  <a class="heading-link" href="#cabe%c3%a7alhos">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<p>Os seguintes elementos HTML <code>&lt;h1&gt;</code>—<code>&lt;h6&gt;</code> representam 6 níveis de cabeçalhos de seção. <code>&lt;h1&gt;</code> é para seções de nível mais alto enquanto <code>&lt;h6&gt;</code> é para o nível mais baixo.</p>
<h1 id="h1">
  H1
  <a class="heading-link" href="#h1">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h1>
<h2 id="h2">
  H2
  <a class="heading-link" href="#h2">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<h3 id="h3">
  H3
  <a class="heading-link" href="#h3">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h3>
<h4 id="h4">
  H4
  <a class="heading-link" href="#h4">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<h5 id="h5">
  H5
  <a class="heading-link" href="#h5">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h5>
<h6 id="h6">
  H6
  <a class="heading-link" href="#h6">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h6>
<h2 id="parágrafo">
  Parágrafo
  <a class="heading-link" href="#par%c3%a1grafo">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<p>Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.</p>
<p>Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.</p>
<h2 id="citações">
  Citações
  <a class="heading-link" href="#cita%c3%a7%c3%b5es">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<p>O elemento de citações representa um conteúdo citado de outra origem, opcionalmente com atribuição que deve estar contida em um elemento <code>footer</code> ou <code>cite</code>, e também opcionalmente com informações in-line como anotações e abreviações.</p>
<h4 id="citações-sem-atribuição">
  Citações sem atribuição
  <a class="heading-link" href="#cita%c3%a7%c3%b5es-sem-atribui%c3%a7%c3%a3o">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<blockquote>
<p>Tiam, ad mint andaepu dandae nostion secatur sequo quae.
<strong>Note</strong> that you can use <em>Markdown syntax</em> within a blockquote.</p>
</blockquote>
<h4 id="citações-com-atribuição">
  Citações com atribuição
  <a class="heading-link" href="#cita%c3%a7%c3%b5es-com-atribui%c3%a7%c3%a3o">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<blockquote>
<p>Não comunique compartilhando memória, compartilhe memória comunicando.<!-- raw HTML omitted -->
— <!-- raw HTML omitted -->Rob Pike<sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup><!-- raw HTML omitted --></p>
</blockquote>
<h2 id="tabelas">
  Tabelas
  <a class="heading-link" href="#tabelas">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<p>Tabelas não fazem parte do cerne da especificação do Markdown, mas o Hugo oferece suporte a elas.</p>
<table>
<thead>
<tr>
<th>Nome</th>
<th>Idade</th>
</tr>
</thead>
<tbody>
<tr>
<td>Bob</td>
<td>27</td>
</tr>
<tr>
<td>Alice</td>
<td>23</td>
</tr>
</tbody>
</table>
<h4 id="tabelas-com-markdown-inline">
  Tabelas com Markdown inline
  <a class="heading-link" href="#tabelas-com-markdown-inline">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<table>
<thead>
<tr>
<th>Italics</th>
<th>Bold</th>
<th>Code</th>
</tr>
</thead>
<tbody>
<tr>
<td><em>italics</em></td>
<td><strong>bold</strong></td>
<td><code>code</code></td>
</tr>
</tbody>
</table>
<h2 id="blocos-de-código">
  Blocos de código
  <a class="heading-link" href="#blocos-de-c%c3%b3digo">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<h4 id="blocos-de-código-com-crase">
  Blocos de código com crase
  <a class="heading-link" href="#blocos-de-c%c3%b3digo-com-crase">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<div class="highlight"><pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-html" data-lang="html"><span style="">&lt;!doctype html&gt;</span>
&lt;<span style="font-weight:bold">html</span> lang=<span style="font-style:italic">&#34;pt-br&#34;</span>&gt;
&lt;<span style="font-weight:bold">head</span>&gt;
  &lt;<span style="font-weight:bold">meta</span> charset=<span style="font-style:italic">&#34;utf-8&#34;</span>&gt;
  &lt;<span style="font-weight:bold">title</span>&gt;Exemplo de Documento HTML5&lt;/<span style="font-weight:bold">title</span>&gt;
&lt;/<span style="font-weight:bold">head</span>&gt;
&lt;<span style="font-weight:bold">body</span>&gt;
  &lt;<span style="font-weight:bold">p</span>&gt;Teste&lt;/<span style="font-weight:bold">p</span>&gt;
&lt;/<span style="font-weight:bold">body</span>&gt;
&lt;/<span style="font-weight:bold">html</span>&gt;
</code></pre></div><h4 id="blocos-de-código-com-quatro-espaços">
  Blocos de código com quatro espaços
  <a class="heading-link" href="#blocos-de-c%c3%b3digo-com-quatro-espa%c3%a7os">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<pre><code>&lt;!doctype html&gt;
&lt;html lang=&quot;pt-br&quot;&gt;
&lt;head&gt;
  &lt;meta charset=&quot;utf-8&quot;&gt;
  &lt;title&gt;Exemplo de Documento HTML5&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
  &lt;p&gt;Teste&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
<h4 id="blocos-de-código-com-highlight-shortcode-interno-do-hugo">
  Blocos de código com highlight shortcode interno do Hugo
  <a class="heading-link" href="#blocos-de-c%c3%b3digo-com-highlight-shortcode-interno-do-hugo">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<div class="highlight"><pre tabindex="0" style="background-color:#fff;-moz-tab-size:4;-o-tab-size:4;tab-size:4"><code class="language-html" data-lang="html"><span style="">&lt;!doctype html&gt;</span>
&lt;<span style="font-weight:bold">html</span> lang=<span style="font-style:italic">&#34;pt-br&#34;</span>&gt;
&lt;<span style="font-weight:bold">head</span>&gt;
  &lt;<span style="font-weight:bold">meta</span> charset=<span style="font-style:italic">&#34;utf-8&#34;</span>&gt;
  &lt;<span style="font-weight:bold">title</span>&gt;Exemplo de Documento HTML5&lt;/<span style="font-weight:bold">title</span>&gt;
&lt;/<span style="font-weight:bold">head</span>&gt;
&lt;<span style="font-weight:bold">body</span>&gt;
  &lt;<span style="font-weight:bold">p</span>&gt;Teste&lt;/<span style="font-weight:bold">p</span>&gt;
&lt;/<span style="font-weight:bold">body</span>&gt;
&lt;/<span style="font-weight:bold">html</span>&gt;</code></pre></div>
<h2 id="tipos-de-listas">
  Tipos de Listas
  <a class="heading-link" href="#tipos-de-listas">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<h4 id="listas-ordenada">
  Listas Ordenada
  <a class="heading-link" href="#listas-ordenada">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<ol>
<li>Primeiro item</li>
<li>Segundo item</li>
<li>Terceiro item</li>
</ol>
<h4 id="listas-não-ordenada">
  Listas não Ordenada
  <a class="heading-link" href="#listas-n%c3%a3o-ordenada">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<ul>
<li>Um item</li>
<li>Outro item</li>
<li>Algum outro item</li>
</ul>
<h4 id="listas-aninhadas">
  Listas aninhadas
  <a class="heading-link" href="#listas-aninhadas">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h4>
<ul>
<li>Frutas
<ul>
<li>Maçã</li>
<li>Laranja</li>
<li>Banana</li>
</ul>
</li>
<li>Laticínios
<ul>
<li>Leite</li>
<li>Queijo</li>
</ul>
</li>
</ul>
<h2 id="outros-elementos--abbr-sub-sup-kbd-mark">
  Outros Elementos — abbr, sub, sup, kbd, mark
  <a class="heading-link" href="#outros-elementos--abbr-sub-sup-kbd-mark">
    <i class="fa fa-link" aria-hidden="true"></i>
  </a>
</h2>
<p><!-- raw HTML omitted -->GIF<!-- raw HTML omitted --> é um formato de imagem bitmap.</p>
<p>H<!-- raw HTML omitted -->2<!-- raw HTML omitted -->O</p>
<p>X<!-- raw HTML omitted -->n<!-- raw HTML omitted --> + Y<!-- raw HTML omitted -->n<!-- raw HTML omitted --> = Z<!-- raw HTML omitted -->n<!-- raw HTML omitted --></p>
<p>Aperte <!-- raw HTML omitted --><!-- raw HTML omitted -->CTRL<!-- raw HTML omitted -->+<!-- raw HTML omitted -->ALT<!-- raw HTML omitted -->+<!-- raw HTML omitted -->Delete<!-- raw HTML omitted --><!-- raw HTML omitted --> para fechar.</p>
<p>A maioria das <!-- raw HTML omitted -->salamandras<!-- raw HTML omitted --> são noturnas e caçam insetos, vermes, e outras criaturas pequenas.</p>
<section class="footnotes" role="doc-endnotes">
<hr>
<ol>
<li id="fn:1" role="doc-endnote">
<p>A citação acima foi extraída da <a href="https://www.youtube.com/watch?v=PAAkCSZUG1c">apresentação</a> do Rob Pike durante a Gopherfest, de 18 de Novembro de 2015.&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol>
</section>
      </div>


      <footer>
        

<section class="see-also">
  
    
    
    
  
</section>


        
        
        
      </footer>
    </article>

    
  </section>

      </div>

      
  <footer class="footer">
    <section class="container">
      
        <p>Coloque algum texto aqui.</p>
      
      
        ©
        
          2019 -
        
        2021
         João Ninguém 
      
      
      
        
      
    </section>
  </footer>


    </main>

    
      
      <script src="/js/coder.min.03b17769f4f91ae35667e1f2a1ca8c16f50562576cf90ff32b3179926914daa5.js" integrity="sha256-A7F3afT5GuNWZ&#43;HyocqMFvUFYlds&#43;Q/zKzF5kmkU2qU="></script>
    

    

    

    

    

    

    

    

    
  </body>

</html>
